body {
    font-size: 14px;
    font-family: PingFang-SC-Medium, PingFang-SC;
}

// 全局滚动条
::-webkit-scrollbar {
    width: 5px;
    height: 10px;
    cursor: pointer;
}

::-webkit-scrollbar-thumb {
    //滚动条里面小方块
    background: #D8D8D8;
    border-radius: 5px;

    :hover {
        background: #D8D8D8;
        ;
    }
}

::-webkit-scrollbar-track {
    // 滚动条里面轨道
    height: 3px;
    width: 3px;
    background: #f0f0f0;
    border-radius: 5px;
}

::-webkit-scrollbar-thumb:horizontal {
    // 滚动条横向滑块
    width: 5px;
    height: 5px;
    cursor: pointer;
    background: #D8D8D8;
    border-radius: 5px;

    :hover {
        background: #D8D8D8;
    }
}

// 垂直水平交汇部分
::-webkit-scrollbar-corner {
    display: block
}

// elementui 滚动条
.el-scrollbar__wrap {
    overflow: scroll;
    width: 110%;
    height: 120%;
}

// i标签去斜体
i {
    text-indent: 0 !important;
}


// el-tree控件的x轴滚动条
.showOverFlow .el-tree-node>.el-tree-node__children {
    overflow: initial;
}

// 普通按钮样式
.button-normal {
    background-color: rgba(255, 255, 255, 1);
    color: $button_normal_defalut_font;
    border-color: $button_normal_defalut_border;

    &:hover {
        background-color: rgba(255, 255, 255, 1);
        color: $button_normal_hover;
        border-color: $button_normal_hover;
    }

    &:active {
        background-color: rgba(255, 255, 255, 1);
        color: $button_normal_click;
        border-color: $button_normal_click;
    }

    &[disabled] {
        background-color: #e8e8e8;
        color: $button_normal_disabled_font;
        border-color: $button_normal_disabled_border;
    }
}

// 辅助样式
.marginLeft {
    margin-left: 12px;
}

.marginRight {
    margin-right: 12px;
}

// 圆
.circle {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 100%;
}

// 无边框
.border-none {
    &>* {
        border: none !important;
    }
}

// 表格头部筛选 - 选项
.filter-switch {
    .filter-item {
        width: 100%;
        margin-bottom: 5px;

        &:last-child {
            margin-bottom: 0;
        }
    }
}

.global-padding {
    padding: 20px;
}

.global-margin {
    margin: 20px;
}

.floatLeft {
    float: left;
}

.clear {
    @include clearfix;
}

.el-main {
    padding: 0;
}

@for $i from 1 through 4 {
    .theme-#{$i} {
        .icon-color {
            // 图标颜色
            color: nth($button_focus_default, $i);
        }

        .border-bottom {
            // 底部边框颜色
            border-bottom-width: 1px;
            border-bottom-style: solid;
            border-bottom-color: nth($button_focus_default, $i);
        }

        .green {
            // 绿色圆
            @extend .circle;
            background-color: #52c41a;
        }

        .red {
            // 红色圆
            @extend .circle;
            background-color: #f5222d;
        }

        .gay {
            // 灰色圆
            @extend .circle;
            background-color: #7a7a7a;
        }

        .blue {
            // 绿色圆
            @extend .circle;
            background-color: #0b7ee7;
        }

        .font_red {
            // 红子、字
            color: #f5222d;
        }

        .border_red {
            // 红边框
            border: 1px solid #f5222d !important;
        }

        .orange {
            // 橙色圆点
            @extend .circle;
            background-color: #ff782d;
        }

        .orange-font {
            // 橙色字
            color: #ff782d;
        }

        .active-button {
            // 激活类似button样式
            padding: 9 16px;
            font-size: $font_size_strong;
            color: #fff;
            background-color: nth($button_focus_default, $i);
        }

        .active-link {
            // 激活文字链接样式
            color: nth($button_focus_default, $i);
        }

        .selected-down {
            // 下拉框的边框与投影
            border: 1px solid nth($selected-dropDown-border, $i);
            box-shadow: 0 0 4px nth($selected-dropDown-shadow, $i);
            background-color: #ffffff;
        }

        .filter-switch .filter-item:hover {
            // 表格头部筛选 - 选项鼠标经过背景色
            background-color: nth($table_color_th_hover, $i);
        }

        .row-color_hover {
            // 行数据经过样式
            background-color: nth($table_color_th_hover, $i);
        }

        .mock-tbody-tr-hover {
            // 模拟tbody行经过样式
            background-color: nth($table_color_th_hover, $i);
        }

        .box__icon_1_1 {
            // 自定义loading样式，块1样式
            background-color: nth($loading-icon-color-1, $i);
        }

        .box__icon_1_2 {
            // 自定义loading样式，块2样式
            background-color: nth($loading-icon-color-2, $i);
        }

        .box__icon_1_3 {
            // 自定义loading样式，块2样式
            background-color: nth($loading-icon-color-3, $i);
        }

        .box__icon_1_4 {
            // 自定义loading样式，块2样式
            background-color: nth($loading-icon-color-4, $i);
        }
    }
}

.gnxicon {
    margin-right: 5px;
    width: 24px;
    text-align: center;
    font-size: 18px;
    vertical-align: middle;
}

.el-tree-node {
    background: #EBEDF7;
}

// // 页面模板
// .handleBox {
//     // margin: 10px 0;
//     padding: 10px 0;
//     vertical-align: middle;

//     .handleIconBox {
//         padding-top: 10px;
//         float: right;
//         width: 160px;
//         text-align: right;
//     }
//   }
//   // 右侧图标，不要和上面合并写
//   .handleIconBox {
//     float: right;
//     width: 160px;
//     text-align: right;
//     i {
//         cursor: pointer;
//         color: #98a5c0;
//     }
// }
// .handleBox i {
//     cursor: pointer;
//     color: #98a5c0;
//     margin: 10px;
//   }

.content-right .title {
    height: 40px;
    font-size: 14px;
    font-weight: 600;
    color: #323c47;
    line-height: 42px;
    padding: 0 0 0 12px;
    font-family: PingFangSC-Semibold, PingFang SC;
    // border: 1px solid #EBEDF7;
    border-bottom: none;
    .gun {
        display: inline-block;
        width: 4px;
        height: 10px;
        background: linear-gradient(180deg, #ea8a5e 0%, #d15230 100%);
    }
}

.dialogSearchBox {
    vertical-align: middle;

    .el-button {
        margin: 0 10px;
    }

    i {
        font-size: 21px;
        font-weight: 600;
        cursor: pointer;
        padding-top: 5px;
    }
}


.startState {
    display: inline-block;
    margin-right: 10px;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background-color: #91DF92;
}

.unStartState {
    display: inline-block;
    margin-right: 10px;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background-color: #EF927F;
}

.transiton {
    transition: all .3s;
}


.export {
    text-align: center;
    .el-button{
        margin: 10px;
    }
}
.el-col{
    min-height: 1px;
}

